<!--合约交易-->
<template>
  <div class="bg bg1">

    <VTPairContract class="api" 
    ref="pair" configKey="trading_chi_api_contract_default" 
    :isPair="false" @change="pairChange" />
    <div class="bg4" style="height:1px"></div>


    <!-- 列表 -->
    <list class="list" v-if="datas.length">
    
      <refresh class="refresh" @refresh="refresh" :display="isRefresh ? 'show' : 'hide'">
        <loading-indicator class="load text1"></loading-indicator>
      </refresh>

      <cell v-for="(item, index) in datas" v-bind:key="index">
        
        <VTChiCell v-if="item.counterCoin" :item="item"
        @tzgg="tzggClick" @zyzs="zyzsClick" @pc="pcClick" />

        <div class="genduo-bg" v-else>
          <text class="font22 text3">{{T('没有更多数据')}}</text>
        </div>
      </cell>
    </list>
    <!--无委托-->
    <div v-else class="kong bg1">
      <LImage class="img-kong" :src="Config.img('list_empty.png')"></LImage>
      <text class="font28 text2">{{T('暂无持仓~')}}</text>
    </div>
  </div>
</template>

<script>

import jmath from "@/_js/math";
import jconfig from "@/_js/config";
import jhttps from "@/_js/https";
import jmodal from "@/_js/modal";
import jnavigator from "@/_js/navigator";
import jbroadcast from "@/_js/broadcast";

import jtrading from "./view/trading"

const weexFunction = weex.requireModule("WeexFunction");

import I18N from "@/_i18n/i18n";
var T = I18N.t;

import VTPairContract from './view/VTPairContract.vue' 
import VTChiCell from './view/VTChiCell.vue'
export default {
  components: {
    VTPairContract,
    VTChiCell
  },
  
  data() {
    return {
      T:T,
      Config:jconfig,
      jmath:jmath,

  
      api:undefined,

      isRefresh:false, //显示刷新
      datas:[],
    };
  },

  mounted() {
  },

  methods: {
    /*************************************************通信触发*/
    //完全显示
    viewappear() {
      this.refresh();
    },

    //完全隐藏
    viewdisappear() {
    },
    
    /************************************************* 初始化*/
    //刷新
    refresh(load=true) {
      if (!this.api.apiId) return;

      if (this.isRefresh) return;
      load && (this.isRefresh = true);

      jtrading.gtApiRsaStr(this.api, true, false, (rsa)=>{
        this.httpsQueryPosition(rsa);
      });
    },

    /**********************************************HTTPS*/
    //https查询持仓列表
    httpsQueryPosition(rsa){

      var param = {'apiData':rsa};
      jhttps.post("manual/queryPosition",param,true,(data)=>{

          if (data.status == 11505) { //服务器公钥过期
            jtrading.delectApiRsaStr(true);
            jtrading.gtApiRsaStr(this.api, true, false, (newrsa)=>{
              this.httpsQueryPosition(newrsa);
            });
            return;
          }

          this.isRefresh = false;
          if(data.status == 200){
            var datas = data.data.positionList;
            datas.forEach((item)=>{
              item.baseCoin = 'USDT';
              item.counterCoin = item.contractId.replace('USDT', '');
              item.unrealizedProfitRate = jmath.cheng(item.unrealizedProfitRate, '100', 2, 2);
              item.unrealizedProfit = jmath.gfCoin(item.unrealizedProfit);
              item.openPrice = jmath.gfCoin(item.openPrice);
              item.markPrice = jmath.gfCoin(item.markPrice);
              item.liquidationPrice = jmath.gfCoin(item.liquidationPrice);
            })
            datas.length && datas.push({})
            this.datas = datas;
          } else {
            jmodal.toast(data.msg);
          }
      });
    },

    /************************************************* 点击*/
    //api改变
    pairChange(api) {
      this.api = api;
      this.refresh();
    },

    /******************************** 点击 */
    //调整杠杠
    tzggClick(item) {
      var pair = {'counterCoin':item.counterCoin, 'baseCoin':item.baseCoin}
      var param = {'api':this.api, 'bl':item.leverage ,pair};
      jnavigator.openDialog('trading/ReviseRate', param);
      jbroadcast.subscribeOnce('ReviseRate', (api)=>{
        this.refresh(false);
      });
    },

    //止盈止损
    zyzsClick() {
    },

    //平仓
    pcClick(item) {

      var api = this.api;
      var pair = {'counterCoin':item.counterCoin, 'baseCoin':item.baseCoin, 
                  'last':item.markPrice, 'increase':'0',
                  'contractSize':'0.0001'};
      var str = JSON.stringify({api, pair});
      weexFunction.setConfig('trading_api_contract_default', str);

      weexFunction.setConfig('trading_contract_actiontype', item.positionSide);

      this.$emit('showView', 1)
    }
  }
};

</script>

<style src="@/_css/style.css" ></style>
<style scoped>
.bg {
  flex: 1;
  flex-direction: column;
}

.api {
  padding-left: 40px;
  padding-right: 40px;
}
.exchange-image {
  width: 36px;
  height: 36px;
}
.arrow{
  width:16px;
  height:12px;
}


/*********************** 列表*/
.list {
  flex: 1;
  flex-direction: column;
}
.cell {
  flex-direction: column;
  padding-left: 40px;
  padding-right: 40px;
}
.head {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 120px;
}
.head-type {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  border-radius: 2px;
  margin-right: 20px;
  padding: 10px;
}

/*********************** 刷新*/
.refresh {
  width: 750;
  flex-direction: row;
  justify-content: center;
}
.load {
  height: 40px;
  width: 40px;
}
.genduo-bg {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 750px;
  height: 100px;
}

.kong {
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.img-kong {
  width: 264px;
  height: 204px;
  margin-bottom: 40px;
}
</style>